<!-- 首页轮播图 -->
<template>
  <div class="home-banner">
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="item in bannerList" :key="item.id">
        <img :src="item.img" alt="" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
import { getBanner } from "@/api/inedx";
export default {
  data() {
    return {
      bannerList: [],
    };
  },
  methods: {
    async getBannerList() {
      let { data } = await this.$http(getBanner());
      this.bannerList = data.data;
    },
  },
  mounted() {
    this.getBannerList();
  },
};
</script>

<style lang="scss" scoped>
.home-banner {
  width: 100vw;
  .my-swipe .van-swipe-item {
    text-align: center;
    height: 11.875rem;
    overflow: hidden;
    img {
      width: 100vw;
      min-height: 11.875rem;
    }
  }
}
</style>
